<script lang="ts" setup>
  import { ref, onMounted } from 'vue';
  import { getDateParse, getNumber } from '@/Utils/time';
  import TimeInit from '@/Components/TimeInit/Index.vue';

  const props = defineProps({
    defaultProps: { type: Object, default: () => {} }
  });
  const { defaultProps } = props;
  const dateShow = ref(defaultProps.date);
  const timeShow = ref(defaultProps.times);
  const { weeks } = defaultProps;
  const { user } = defaultProps;

  const setTime = () => {
    setInterval(() => {
      const date = getDateParse();
      dateShow.value = `${date.year}年${getNumber(date.month)}月${getNumber(date.date)}日 ${
        weeks[date.day]
      } `;
      timeShow.value = `${getNumber(date.hours)}:${getNumber(date.minutes)}:${getNumber(
        date.seconds
      )}`;
    }, 1000);
  };

  onMounted(() => {
    setTime();
  });
</script>

<template>
  <div>
    <time-init :date-show="dateShow" :time-show="timeShow" :user="user" />
  </div>
</template>
